<!DOCTYPE html>
<html lang="en">

<head>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta charset="UTF-8">
	<title>小知识</title>
	<link rel="stylesheet" href="/meetTWO/public/static/css/init.css">
	<link href="http://cdn.bootcss.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
	<style type="text/css">
		button {
			/*幽灵按钮*/
			width: 13%;
			height: 15%;
			box-sizing: border-box;
			background-color: rgba(0, 0, 0, 0);
			/*把按钮与背景色高度透明*/
			border: 2px solid rgba(225, 225, 225, 0.6);
			/*重点边框设置，透明度0.6*/
			font-size: 16px;
		}

		header {
			/*背景图*/
			background-image: url(/meetTWO/public/static/images/aoyun.jpg);
			background-size: 100% 100%;
		}

		h3 {
			height: 130px;
			line-height: 100px;
			text-align: center;
			margin: 0px auto;
		}

		nav {
			height: 50px;
		}

		nav input {
			box-sizing: border-box;
			border-radius: 8px;
			width: 70%;
			height: 35px;
			margin: 6px 5px;
			padding: 8px 8px;
		}

		ul img {
			width: 50px;
			height: 50px;
		}

		#main {
			width: 90%;
			height: 500px;
			margin: 0px auto;
			box-sizing: border-box;
		}

		article {
			background: white;
			margin-bottom: 1px 0px;
			padding: 10px 0px;
			border-bottom: 1px solid #339999;
			font-family: '方正字迹-吕建德行楷', '汉仪全唐诗简体', '方正正纤黑简体', '幼圆', '楷体', '方正书宋简体', '微软雅黑', '黑体', '宋体', sans-serif;
		}

		article a {
			color: black;
			margin-bottom: 10px;
			padding: 10px;
		}

		h4 a {
			color: #336666;
			font-weight: bold;
			font-family: '方正字迹-吕建德行楷', '汉仪全唐诗简体', '楷体', '幼圆', '方正书宋简体', '微软雅黑', '黑体', '宋体', sans-serif;

		}

		h4 a:hover {
			color: gray;
		}

		article p {
			padding: 10px 1px;
			text-indent: 2px;
		}
	</style>
</head>

<body>
	<header>
		<a href="#">
			<button class="button button-large button-plain button-border button-circle" onclick="location.href='/meetTWO/public/index/'">
				<i class="fa fa-angle-left"></i>
			</button>
		</a>
		<h3>奥运小知识</h3>
	</header>
	<nav>
		<ul>
			<img src="/meetTWO/public/static/images/sousuo.png" alt="search" id="search-but" onclick="select()">
			<input type="text" name="search" placeholder="S e a r c h . . ." maxsize="20" id="search-input">
		</ul>
	</nav>
	<div id="main">


		{volist name="list" id="vo"}
		<article>
			<div class="text1">
				<h4>
					<a href="#">{$vo.title}</a>
				</h4>
				<p>
					{$vo.content}
			</div>
		</article>
		{/volist}
	</div>
</body>
<script type="text/javascript">
	function select(){
		console.log(document.getElementById('search-input').value)
		location.href='/meetTWO/public/index/recommend/getSelectKnowledge'+'?where='+document.getElementById('search-input').value
	}
</script>
</html>